<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath();%>
<%String contextPath = request.getContextPath();%>
<jsp:include page="inc.jsp" />
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<script type="text/javascript">
	/* jquery入口*/
	$(function() {
		loadgrid(); //加载datagrid
	});
	/* 加载datagrid列表*/
	function loadgrid() {
		$('#grid').datagrid({
			title : '退换货',
			loadMsg : '正在加载…', //当从远程站点载入数据时，显示的一条快捷信息。
			fit : true, //窗口自适应
			nowrap : false, //设置为true，当数据长度超出列宽时将会自动截取
			fitColumns : true, // 自动适应列宽
			singleSelect : false, // 每次只选中一行
			sortName : 'id', //默认排序字段
			sortOrder : 'asc', // 升序asc/降序desc
			striped : true, // 隔行变色  
			pagination : true, // 在底部显示分页工具栏
			pageNumber : 1, //初始化页码 
			pageSize : 20, // 指定每页的大小，服务器要加上page属性和total属性
			pageList : [ 20, 30, 50 ], // 可以设置每页记录条数的列表，服务器要加上rows属性
			//rownumbers : true, // 在最前面显示行号 
			onLoadSuccess : function(data) {
				if (data.total == 0) {
					$.messager.alert("提示", "没有处理过该笔销售,请核实...", "info");
					$('#ss').textbox('clear');
					return;
				}
			},
			idField : 'id', // 主键属性
			// 冻结列,当很多咧出现滚动条时该列不会动
			frozenColumns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				title : '序号',
				width : '50',
				field : 'id',
				sortable : true
			}, {
				title : '书名',
				width : '200',
				field : 'productName',
				sortable : true
			}, {
				title : 'ISBN码',
				width : '120',
				field : 'productNo',
				sortable : false
			}, {
				title : '定价',
				width : '70',
				field : 'price',
				sortable : false
			}, {
				title : '可退数量',
				width : '80',
				field : 'quantity',
				sortable : false
			} ] ],
			columns : [ [ {
				title : '购买价格',
				width : '100',
				field : 'subtotal',
				sortable : false
			} ] ],
			// 工具栏按钮
			toolbar : '#tb'
		});
	}
	//删除左右两端的空格  
	function trim(str) {
		return str.replace(/(^\s*)|(\s*$)/g, "");
	}
	/* 回车 事件*/
	$(function() {
		$('#ss').textbox('textbox').keydown(function(e) {
			var ss = trim($('#ss').val());
			if ((e.keyCode || e.which) == 13) {
				if (ss == null && typeof (ss) == "undefined" || ss == "") {
					$.messager.alert("提示", "请输入购物小票号...", 'info');
					return;
				}
				/* $('#grid').datagrid('load',{ saleOrderNo: $('#ss').val()}); */
				$('#grid').datagrid({
					url : 'SaleReturnController?method=selectSaleReturn',
					queryParams : {
						saleOrderNo : $('#ss').val()
					}
				});
			}
		});
	});

	/* 显示Dialog*/
	
	function openDialog(title, amount) {
		$("#dialog").dialog({
			resizable : false,
			modal : true,
			buttons : [ { //设置下方按钮数组
				text : '退款',
				iconCls : 'icon-remove',
				handler : function() {
					cal();
				}
			}, { //设置下方按钮数组
				text : '保存',
				iconCls : 'icon-save',
				handler : function() {
					save();
				}
			}, {
				text : '取消',
				iconCls : 'icon-cancel',
				handler : function() {
					closeDialog();
				}
			} ]
		});
		$("#dialog").dialog('setTitle', title);
		$("#dialog").dialog('open');
		$('#amount').val(amount);
	}

	/* 关闭Dialog*/
	function closeDialog() {
		$('#returnProduct').children().remove();
		$("#form").form('clear'); // 清空form的数据
		$("#dialog").dialog('close');// 关闭dialog
	}

	/* 保存数据*/
	function save() {
		var data = {
				"reason" : $('#reason').val(),
				"total" : $('#amount').val(),
				"handler" : $('#handler').val()
		}
		//提交到后台的action
        $.post('SaleReturnController?method=addSaleReturn', data, function(result) {
			var result = eval('(' + result + ')');
			if (result.success) {
				closeDialog();// 调用closeDialog;    
				$.messager.show({ //显示正确信息
					title : '提示',
					msg : result.msg
				});
			} else {
				$.messager.show({ //显示错误信息
					title : '错误',
					msg : result.msg
				});
			}
		});
	}

	/* 退款 */
	function cal() {
		var num = $('#returnProduct').children().length;
		var prices = [];
		var quantities = [];
		for (var i = 0; i < num; i++) {
			prices.push($('#price'+i).val());
			quantities.push($('#quantity'+i).val());
		}
		var total = 0;
		for(var i=0;i<num;i++){
			total = total + prices[i]*quantities[i];
		}
		$('#amount').val(total);
	}
	
	/* 选择退货产品 */
	function returnSale() {
		var rows = $('#grid').datagrid('getSelections');
		var amount = 0;
		//如果没有选中记录
		if (rows.length == 0) {
			$.messager.alert("提示", "请选择一条记录", 'info');
			return;
		}
		for (var i = 0; i < rows.length; i++) {
			$('#returnProduct')
					.append(
							'<div><label>退货图书：</label><input id="productName'+i+'" name="productName" value="'+rows[i].productName+'" /><label>退货数量：</label><input id="quantity'+i+'" name="quantity" value="'+rows[i].quantity+'" style="width:50"/><input id="price'+i+'" name="price" type="hidden" value="'+rows[i].subtotal/rows[i].quantity+'" style="width:50"/></div>');
			amount = amount + rows[i].subtotal;
		}
		openDialog("退货管理", amount);
	}
</script>

<body>
	<div style="width: 100%; height: 100%; padding: 0px; overflow: hidden">
		<table id="grid"></table>
	</div>
	<div id='tb'>
		<br>
		<div style="display: inline;">
			购物小票：<input id="ss" class="easyui-textbox" data-options="prompt:'输入购物小票号...'" style="width: 200px; height: 26px;"><br><br> 
			退货理由：<input id="reason" class="easyui-textbox" style="width: 200px; height: 26px;" value="质量问题"> 
			<a id="return" class="easyui-linkbutton" iconCls="icon-ok" onclick="returnSale()">退货</a> <br><br>
		</div>
	</div>
	<div id="dialog" class="easyui-dialog" data-options="closed:true" title="退货管理" style="text-align: center;width:500px;">
		<form id="form" method="post">
			<div>
				<div>
				<label>经 手 人：</label> 
				<input class="easyui-textbox" id="handler" data-options="required:true" />
			</div>
			<br>
			<div id="returnProduct"></div>
			<div style="display: inline">
				<font style="font-family: 微软雅黑; font-size: 35px; color: red;">退款：</font>
				<input id="amount" type="text" readOnly="true" style="height: 94; width: 170; text-align: center; font-size: 48; color: #FF0000; padding: 5px 5px 5px 5px; background-color: transparent; border: 0">
			</div>
		</form>
	</div>
</body>
</html>